<template>
    <div>
      <!-- <el-dialog title="地图选点" :close-on-click-modal="false" :visible.sync="dialogVisible" width="60%">
          <tencent-map @callback="callback" style="height:650px" />
          <div @click="fileMap">123</div>
      </el-dialog> -->
      <el-dialog title="地图选点" :close-on-click-modal="false" :visible.sync="dialogVisibleFile" width="60%">
          <map-file  @callback="callback" style="height:650px" />
      </el-dialog>
    </div>
</template>

<script>
import TencentMap from '@/components/tencent-map/index'
import MapFile from './dialog-map-file.vue'
export default {
    components:{
        TencentMap,
        MapFile
    },
    data(){
        return{
            dialogVisible: false,
            dialogVisibleFile:false,
            address_info:{}
        }
    },
    methods:{
        init(){
            // this.dialogVisible = true;
            this.dialogVisibleFile = true;
        },
        // 地图选择回调
        callback(mapData) {
            console.log(mapData)
            let address_info = {};  // 详细地址对象
            address_info.address_latitude = mapData.latlng.lat
            address_info.address_longitude = mapData.latlng.lng

            let reg = /.+?(省|市|自治区|自治州|县|区)/g
            let areaArr = mapData.poiaddress.match(reg) || [] // 匹配省市区，生成数组
            address_info.area_info = areaArr.join(' ')

            // 如果是直辖市，数组2需要补充一个。如果是香港，直接可以选择对应的区
            if (areaArr.length < 3 && areaArr[0].indexOf('香港') === -1) {
                areaArr.unshift(areaArr[0])
            }
            address_info.area_info_detail = mapData.poiname // 存储地图选择的地址名称
            address_info.address_detail = mapData.poiname // 存储地图选择的地址名称
            this.$emit('changeSelect',address_info);
            this.dialogVisible = false;
            this.dialogVisibleFile = false
        },
        fileMap() {
            this.dialogVisible = false
            this.dialogVisibleFile = true
        }
    }
}
</script>